<template>
	<view class="zmxy-sticky-top" :style="style">
		<slot></slot>
	</view>
</template>

<script>
	export default {
		name: "zmxy-sticky-top", // 吸顶
		props: {
			zIndex: {
				type: [Number, String],
				default: 99,
			},
			top: {
				type: String,
				default: '',
			},
		},
		computed: {
			style() {
				let style = 'z-index: ' + this.zIndex + ';';
				if (this.top) {
					style += 'top:' + this.top + ';';
				}
				return style;
			}
		},
		data() {
			return {};
		}
	}
</script>

<style lang="scss">
	.zmxy-sticky-top {
		/* #ifndef APP-PLUS-NVUE */
		display: flex;
		position: -webkit-sticky;
		/* #endif */
		position: sticky;
		top: var(--window-top);
	}
</style>